<template>
  <div>
    <el-row :gutter="20">
      <el-col :span="12">
        <el-alert
            title="成功提示的文案"
            type="success"
            :closable="false">
        </el-alert>
        <el-alert
            title="消息提示的文案"
            type="info"
            center
            show-icon
            close-text="知道了">
        </el-alert>
        <el-alert
            title="警告提示的文案"
            description="文字说明文字说明文字说明文字说明文字说明文字说明"
            type="warning"
            center
            show-icon>
        </el-alert>
        <el-alert
            title="错误提示的文案"
            type="error"
            center
            show-icon>
        </el-alert>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  data(){
    return{

    }
  }
}
</script>

<style scoped>
.el-row,h4{
  margin-top: 20px;
}
.el-alert{
  margin-top: 10px;
}
</style>